<!DOCTYPE html>
<html>
<head>
<meta name="csrf-token" content="{:token()}">
{include file="layout/head"}
</head>
<body>


<section class="material-half-bg">
	<div class="cover">
	</div>
</section>
<section class="login-content">

	<div class="logo">
		<h1>{:config('web.english_name')}</h1>
	</div>

	<div class="login-box">
		<form class="login-form" action="{:url('index')}" method="post" id="loginform">
			<h3 class="login-head"><i class="fa fa-lg fa-fw fa-user"></i>登录</h3>
			<div class="form-group">
				<label class="control-label">用户名</label>
				<input class="form-control" required type="text" name="username" placeholder="用户名" autofocus
				value=""
				>
			</div>
			<div class="form-group">
				<label class="control-label">密码</label>
				<input class="form-control" required type="password" name="password" placeholder="密码">
			</div>
			<!--
			<div class="form-group">
				<div class="utility">
				<div class="animated-checkbox">
				<label>
				<input type="checkbox"><span class="label-text">Stay Signed in</span>
				</label>
				</div>
				<p class="semibold-text mb-2"><a href="#" data-toggle="flip">Forgot Password ?</a></p>
				</div>
			</div>
			-->
			<div class="form-group btn-container">
				<button type="button" class="btn btn-primary btn-block" id="submitbutton"><i class="fa fa-sign-in fa-lg fa-fw"></i>登录</button>
			</div>
		</form>

		<form class="forget-form" action="index.html">
			<h3 class="login-head"><i class="fa fa-lg fa-fw fa-lock"></i>Forgot Password ?</h3>
			<div class="form-group">
				<label class="control-label">EMAIL</label>
				<input class="form-control" type="text" placeholder="Email">
			</div>
			<div class="form-group btn-container">
				<button class="btn btn-primary btn-block"><i class="fa fa-unlock fa-lg fa-fw"></i>RESET</button>
			</div>
			<div class="form-group mt-3">
				<p class="semibold-text mb-0"><a href="#" data-toggle="flip"><i class="fa fa-angle-left fa-fw"></i> Back to Login</a></p>
			</div>
		</form>
	</div>
</section>
<!-- Essential javascripts for application to work-->
<script src="__ADMINSTATIC__/js/jquery-3.3.1.min.js"></script>
<script src="__ADMINSTATIC__/js/popper.min.js"></script>
<script src="__ADMINSTATIC__/js/bootstrap.min.js"></script>
<script src="__ADMINSTATIC__/js/main.js"></script>
<!-- The javascript plugin to display page loading on top-->
<script src="__ADMINSTATIC__/js/plugins/pace.min.js"></script>
<script type="text/javascript" src="__ADMINSTATIC__/js/plugins/bootstrap-notify.min.js"></script>
<script type="text/javascript">
// Login Page Flipbox control
$('.login-content [data-toggle="flip"]').click(function() {
	$('.login-box').toggleClass('flipped');
	return false;
});

$('#submitbutton').click(function(){
	var url = '{:url('index')}';
	var param = $("#loginform").serialize();

	$.ajaxSetup({
		headers: {
		'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
		}
	});

	$.post(url,param,function(data){
		var token = data.token;
		$('meta[name="csrf-token"]').attr('content',token);
		if(data.status == 1){
		window.location.href="{:url('admin/Index/index')}";
		} else {
			$.notify({
				title: "",
				message: data.notice,
				icon: 'fa fa-close' 
			},{
				type: "info"
			});
		}
	},'json');
});

$(document).keydown(function (event) {
	if (event.keyCode == 13) {
		$('#submitbutton').triggerHandler('click');
	}
});

</script>
</body>
</html>
